<!--
 * @Description:
 * @Author 卞鹏飞 <228443632@qq.com>
 * @create 03/01/25 AM9:13
 -->
<!--setup-->
<script setup lang="ts">
import { onMounted, getCurrentInstance, ref, type ComponentInternalInstance, useAttrs, computed } from 'vue'
import BaseImage from '@shared/base/base-image/index.vue'
import { baseImageProps } from '@shared/base/base-image/types.ts'
import { openPreviewCompat } from '@/utils/file-util.ts'

const { proxy } = getCurrentInstance() as ComponentInternalInstance

const props = defineProps({
  ...baseImageProps
})
const emit = defineEmits({})

defineOptions({
  name: 'BizImage'
})

/* 状态 */
const baseImageRef = ref<InstanceType<typeof BaseImage>>() // base-image 实例对象
const attrs = useAttrs()

/* 方法 */

/**
 * 预览
 */
function openPreview(val: string, ext?: string) {
  // @ts-expect-error
  openPreviewCompat({ filePath: val, type: ext }, {
    isDownload: true
  })
}

/* 计算 */

/**
 * 属性
 */
const _attrs = computed(() => {
  return {
    openPreview,
    ...props,
    ...attrs
  }
})

/* 监听 */

/* 周期 */
onMounted(() => {})

/* 暴露 */
defineExpose({
  $: proxy.$
})
</script>

<!--render-->
<template>
  <BaseImage
    ref="baseImageRef"
    class="biz-image"
    v-bind="_attrs"
  >
    <template
      v-for="(_, key) in $slots"
      #[key]="scoped"
      :key="key"
    >
      <slot
        v-bind="scoped || {}"
        :name="key"
      />
    </template>
  </BaseImage>
</template>

<!--style-->
<style scoped lang="less"></style>
